<template>
	<el-dialog v-model="dialogVisible" append-to-body :show-close="false" :close-on-click-modal="false"
		class="flex-align" style="width: 100%;height: 100%;padding: 30px 24px;margin: 0;background: transparent;">
		<template #header>
			<el-card style="width: 100%;height: 100%;" body-style="padding: 0;" shadow="never">
				<template #header>
					<div class="flex-space-between">
						<div>
							<el-text style="font-size: 16px;">
								库存盘点表
							</el-text>
						</div>
						<div>
							<el-button @click="closeDialog">取消</el-button>
							<el-button type="primary" @click="closeDialog">
								保存
							</el-button>
						</div>
					</div>
				</template>
				<el-scrollbar :style="`height: calc(100vh - 69px - ( 30px + 30px));`">
					<el-form model ref="vForm" rules label-position="top" label-width="50px" style="padding: 16px;">
						<!--  -->
						<el-form-item label="盘点仓库" prop="">
							<el-input type="text" clearable></el-input>
						</el-form-item>
						<el-form-item label="盘点库存" prop="">
							<el-input type="text" disabled placeholder="请先选择：盘点仓库" clearable></el-input>
						</el-form-item>
						<el-form-item label="账面数量" prop="">
							<el-input type="text" clearable></el-input>
						</el-form-item>
						<!--  -->
						<el-form-item label="盘点数量" prop="">
							<el-input type="text" clearable></el-input>
						</el-form-item>
						<el-form-item label="盈亏数量" prop="">
							<el-input type="text" disabled placeholder="保存后显示计算结果" clearable></el-input>
						</el-form-item>
						<!--  -->
						<el-form-item label="调整原因" prop="">
							<el-input type="textarea" :autosize="{ minRows: 3}" clearable></el-input>
						</el-form-item>
						<!--  -->
					</el-form>
				</el-scrollbar>
				<!--  -->
			</el-card>
		</template>
	</el-dialog>
</template>

<script setup lang="ts">
	import { ref } from 'vue';
	import { UploadFilled, } from '@element-plus/icons-vue';
	//
	const dialogVisible = ref(false);
	/**
	 * 打开弹出层
	 */
	const openDialog = (item : any) => {
		dialogVisible.value = true;
	}
	/**
	 * 关闭弹出层
	 */
	const closeDialog = (item : any) => {
		dialogVisible.value = false;
	}
	//暴露属性和方法给外部使用
	defineExpose({
		openDialog
	})
</script>
<style>
	@import '../../../assets/css/my-form-item.css';

	.form-item-bg {
		background-color: #bfdfff;
	}

	.form-item-bg1 {
		background-color: #a5f2e5;
	}
</style>

<style scoped lang="scss">
	@import '../../../assets/css/index.scss';
</style>